<template>
    <view class="cart-item">
        <cart-item-product
            :selectData="selectData"
            :productInfo="productInfo"
            @changeCheck="changeCheck"></cart-item-product>
        <cart-item-specs
            :selectData="selectData"
            v-for="(item, index) in productInfo.SubItems"
            :key="item.ID"
            :productInfo="item"
            @upNum="upNum"
            @checkboxChange="checkboxChange"></cart-item-specs>
    </view>
</template>

<script>
import cartItemProduct from "@/components/cart/cart-item-product.vue"
import cartItemSpecs from "@/components/cart/cart-item-specs.vue"
export default {
    components: {
        cartItemProduct,
        cartItemSpecs,
    },
    props: {
        productInfo: {
            type: Object,
            default: {},
        },
        selectData: {
            type: Object,
            default: {},
        },
        isShowCheckBox: {
            type: Boolean,
            default: true,
        },
    },
    data() {
        return {}
    },
    mounted() {},
    methods: {
        upNum(e) {
            this.$emit("upNum", this.productInfo)
        },
        changeCheck(e) {
            this.$emit("changeCheck", e)
        },
        checkboxChange(e, id) {
            this.$emit("checkboxChange", e, id)
        },
    },
}
</script>

<style lang="scss" scoped>
.cart-item {
    background: $color-white;
    padding: 11rpx $app-page-padding;
    border-radius: $border-radius-10;
    margin-bottom: 20rpx;
}
</style>
